<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Login Page</title>
    <style>
        body { font-family: Arial, sans-serif; background-color: #f4f4f4; text-align: center; padding-top: 50px; }
        .login-container { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 0 10px rgba(0,0,0,0.1); display: inline-block; }
        input[type="text"], input[type="password"] { width: 90%; padding: 10px; margin: 10px 0; border: 1px solid #ccc; border-radius: 4px; }
        button { background-color: #5cb85c; color: white; padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; }
    </style>
</head>
<body>
<div class="login-container">
    <h1>请登录</h1>
    <div th:if="${param.error}" style="color: red;">
        无效的用户名或密码。
    </div>
    <div th:if="${param.logout}" style="color: green;">
        您已成功退出。
    </div>
    <form th:action="@{/login}" method="post">
        <div>
            <label>用户名: <input type="text" name="username"></label>
        </div>
        <div>
            <label>密码: <input type="password" name="password"></label>
        </div>
        <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
        <div>
            <button type="submit">登录</button>
        </div>
    </form>
    <p>没有账号？<a href="/register">注册</a></p>
</div>
</body>
</html>
